<!DOCTYPE html>
<html>
<head>
<!-- author:陈维豪 11.29 19:20 -->
	<meta charset="utf-8">
	<title>公告上传</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link rel="stylesheet" href="css/oksub.css">
	<link rel="stylesheet" href="layui_ext/dtree/dtree.css">
  	<link rel="stylesheet" href="layui_ext/dtree/font/dtreefont.css">
	<script type="text/javascript" src="lib/loading/okLoading.js"></script>
</head>
<body>
<div class="ok-body">
	<div class="layui-layout layui-layout-admin">
	<!-- 就算不上传文件，只要走了上传文件的servlet,都要写这个标注 ?-->
		<form class="layui-form " lay-filter="form">
		  <div class="layui-form-item">
		    <label class="layui-form-label">公告主题</label>
		    <div class="layui-input-block">
		      <input type="text" id="title" name="title" lay-filter="title" lay-verify="required" autocomplete="off" placeholder="请输入公告主题" class="layui-input">
		    </div>
		  </div>
		  
			<div class="layui-form-item layui-form-text">
				<label class="layui-form-label">接收网点</label>
				<div class="layui-input-block">
					<textarea name="networks_name" placeholder="" id="networks_name" class="layui-textarea" lay-verify="required" readonly="readonly"></textarea>
					<input type="hidden" id="networks_id"  name="networks_id" lay-filter="networks_id" autocomplete="off"  class="layui-input">
				</div>
			</div>
		  
		  <div class="layui-form-item layui-form-text">
		    <div class="layui-input-block">
		      <button type="button" class="layui-btn" id="select_network">
		        <i class="layui-icon">&#xe61f;</i>选择网点
		      </button>
		    <div class="layui-inline" style=" width: 150px;">
		    <label class="layui-form-label">是否必读</label>
    		<div class="layui-input-block">
      			<input type="checkbox" id="if_required" name="if_required" lay-filter="if_required"  lay-skin="switch" lay-text="是|否">
    		</div>
		    </div>
		    </div>
		  </div>
		  
		  <div class="layui-form-item layui-form-text">
		    <label class="layui-form-label">公告内容</label>
		    <div class="layui-input-block">
		      <textarea id="content" style="display: none;" lay-filter="content"  name="content"></textarea>
		    </div>
		  </div>
		  
		  <div class="layui-form-item layui-form-text">
		    <label class="layui-form-label">附件</label>
		    <div class="layui-input-block">
		      <button type="button" class="layui-btn" id="upload">
		        <i class="layui-icon">&#xe67c;</i>上传附件
		      </button>
		    </div>
		  </div>
		  
		  <div class="layui-form-item">
		    <div class="layui-input-block">
		      <input class="layui-btn" lay-submit="" id="formSubmit" lay-filter="submit" value="立即提交">
		    </div>
			
		  </div>
		</form>
		
	</div>

</div>

<script src="lib/layui/layui.js"></script>
<script>
		layui.extend({
		    dtree: '{/}layui_ext/dtree/dtree'   // {/}的意思即代表采用自有路径，即不跟随 base 路径
		  }).use(['form','layer','jquery','okLayer','laydate','upload','layedit', 'okUtils', 'okMock','dtree'],function(){
			form = layui.form;
			layer = layui.layer;
			$ = layui.jquery;
			upload = layui.upload;
			let laydate = layui.laydate;
			let okLayer = layui.okLayer;
			let okUtils = layui.okUtils;
			let okMock = layui.okMock;
			dtree = layui.dtree;
			okLoading.close($);
			
			var imgs = new Array();
			
			layedit = layui.layedit;
			
			
			   form.on('submit(submit)', function(data){
					if(data.field.file==""||data.field.file==undefined){
						console.log("公告没有文件，采用form表单监听上传方式提交");
					     //同步富文本编辑器
					     layedit.sync(index);
					     //给data的context属性赋值（因为提交按钮还绑定了文件上传事件，点一次只会上传文件，拿不到富文本编辑器的值，要点两次，所以直接这样赋值）
					     data.field.content = layedit.getContent(index);
					     console.log(data.field);
							okLayer.confirm("确定要提交公告吗？", function () {
								okUtils.ajax("api/anno?op=annoNoFileAdd", "post",data.field, true).done(function (response) {
									console.log(response);
									okUtils.tableSuccessMsg(response.msg);
								}).fail(function (error) {
									console.log(error)
								});
							})				     
					}else{
					     console.log("公告含有文件，采用文件上传方式提交");
					}
				     return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
				   });
			
	        var uploadInst = upload.render({
	            elem: '#upload'
	            ,url: 'api/anno?op=annoAdd'
	            //设置允许上传的文件属性
	            ,accept: 'file'
	            ,auto: false
	            ,bindAction: '#formSubmit'
	            ,before: function(obj){ 
	            layedit.sync(index);
	            this.data = {
	            	title: $('#title').val(),
	            	networks_id: $('#networks_id').val(),
	            	if_required: $('#if_required').val(),
	            	content: $('#content').val(),
	            	file:$("input[name='file']").val()
	             }
	               console.log(this.data);
	            }
	            ,done: function(res){
	            	
	            	if(res.code!=0){
	            		return layer.msg('上传失败');
	            	}
	            	else if(res.code==0){
	            		return layer.msg("上传成功！");
	            		layer.load();
	            	}
	            }
	          });
			
			index = layedit.build('content', {
				tool: [
					  'strong' //加粗
					  ,'italic' //斜体
					  ,'underline' //下划线
					  ,'del' //删除线
					  
					  ,'|' //分割线
					  
					  ,'left' //左对齐
					  ,'center' //居中对齐
					  ,'right' //右对齐
					  ,'link' //超链接
					  ,'unlink' //清除链接
					  ,'face' //表情
					]
			}); //建立编辑器
			
	        $("#select_network").click(function(){
	        	  layer.open({
	        		    type: 1, //type:0 也行
	        		    title: "选择树",
	        		    area: ["400px", "80%"],
	        		    content: '<ul id="openTree5" class="dtree" data-id="0"></ul>',
	        		    btn: ['确认选择'],
	        		    success: function(layero, index){
	        		      var DTree = dtree.render({
	        		        obj: $(layero).find("#openTree5"), 
	        				url: "api/net?op=networkList", 
	        				dataStyle: "layuiStyle",
	        				response:{message:"msg",statusCode:0},
	        				checkbar: true, 
	        				checkbarType: "no-all",
	        		        done: function(data, obj){  //使用异步加载回调
	        		         var reportId = $("#networks_id").val();
	        		         dtree.chooseDataInit("openTree5", reportId); // 初始化复选框的值
	        		        }
	        		      });
	        		    },
	        		    yes: function(index, layero) {
	        		      var flag = true;
	        		      var params = dtree.getCheckbarNodesParam("openTree5"); // 获取选中值
	        		      if(params.length == 0){
	        		        layer.msg("请至少选择一个节点",{icon:2});
	        		        flag = false;
	        		      }
	        		      
	        		      // 设置复选框的值，也可以用示例3的方式
	        		      var ids = [], names = [];
	        		      for(var key in params){
	        		        var param = params[key];
	        		        ids.push(param.nodeId);
	        		        names.push(param.context);
	        		      }
	        		      $("#networks_id").val(ids.join(","));
	        		      $("#networks_name").val(names.join(","));

	        		      if(flag){
	        		        layer.close(index);
	        		      }
	        		    }
	        		  });
				
	       			 });
		   
			
			

		   
			
		});
		
	</script>
</body>
</html>